
@define avatarWidth: 66px;
@define avatarHeight: 66px;

.PlayerInfoItemRoot{
    horizontal-align:right;
    margin-top: 3px;

    transition-property:position,opacity;
    transition-duration:.5s;
}

#RankContainer{
    width: 60px;
    height: 60px;
    margin-right: 60px;
}

.LocalPlayer{
    /*brightness: 2.0;*/
    /*color: #ffd548;*/
    /*transform : scale3d( 1.1,1.1,1.1);*/
    margin-right: 7px;
}



.DetailInfoContainer{
    flow-children:right;
}

#DetailInfo{
    /*width: 200px;*/
    flow-children:down;
    padding: 3px;
    height: 100%;
    visibility: collapse;
    transition-property: visibility;
    transition-duration: 0.4s;
}

.DetailInfoContainer .AlignContainer{
    flow-children:right;
    horizontal-align:center;
    vertical-align: center;
}

.DetailInfoContainer .AlignContainer Image{
    horizontal-align:left;
    width: 30px;
    height: 30px;
}

.DetailInfoContainer Label{
    vertical-align: center;
    margin-left: 2px;
}

#AbilitiesInfo{
    horizontal-align:center;
}

#AbilitiesInfo DOTAAbilityImage{
    width: 30px;
    height: 30px;
}

.PlayerInfoContainer{
    margin-top: 7px;
    horizontal-align:right;
    flow-children:down;
    /*background-image:url("s2r://panorama/images/hud/reborn/ability_bg_psd.vtex");*/
    background-color: #181a1e;
    background-size: 100% 100%;
    border-radius: 3px;
    padding: 3px;
}

#UserNameContainer{
    padding: 3px;
    background-color: rgba(95, 118, 188, 0.84);
    width: 100%;
    vertical-align: middle;
    horizontal-align:right;
}

#UserNameContainer Label{
    horizontal-align:center;
    vertical-align: middle;
    text-align: center;
    text-overflow: ellipsis;
    font-size: 17px;
    font-weight: bold;
    white-space: nowrap;
}



#Avatar{
    width: avatarWidth;
    height: avatarHeight;
}

#BotAvatar{
    visibility: collapse;
    width: avatarWidth;
    height: avatarHeight;
}

#HeroAvatar{
    visibility: collapse;
    width: avatarWidth;
    height: avatarHeight;
}

.HpBarContainer{
    width: 100%;
    vertical-align: top;
    background-color:gradient( linear, 0% 0%, 0% 100%, from( #373f48  ), color-stop( 0.2, #555555 ), color-stop( .5, #3d3d3d), to( #555555) );
    height:18px;
}

#HpBar{
    background-color:gradient( linear, 0% 0%, 0% 100%, from( #3d5425  ), color-stop( 0.2, #5db62b ), color-stop( .5, #4D9030), to( #3d5425) );
    width:100%;
    height:18px;
    margin-top:0px;
    border-radius: 0px;
    transition-property:width;
    transition-duration:0.2s;
}




#HpBarText{
    font-size: 15px;
    vertical-align: center;
    horizontal-align:center;
    font-weight: bold;
}


#EliteFX
{
    width: 100%;
    height: 100%;
    position: 3px -4px 0;
}

#RankLogo{

}
